<template>
  <div>
    <div class="select_top">
      <el-input v-model="quaryParam" @keyup.native.enter="getUnitList" placeholder="请输入单位名称" style="width:29%;margin-right:10px"></el-input>
      <el-button @click="getUnitList">搜索</el-button>
      <el-button type="primary" style="float:right" @click="showUint=true">新增</el-button>
    </div>
    <el-table
      v-loading="loadingunit"
      ref="filterTable"
      :data="unitList"
      style="width: 92%;font-size:13px;margin: 20px auto"
    >
      <el-table-column
        type="index"
        width="50"
        label="序号"
      >
      </el-table-column>
      <el-table-column
        prop="hash.orgname"
        label="单位名称"
      >
      </el-table-column>
      <el-table-column
        prop="hash.manager"
        label="负责人"
      >
      </el-table-column>
      <el-table-column
        prop="hash.leader"
        label="领导"
      >
      </el-table-column>
      <el-table-column
        prop="hash.userid"
        label="用户名"
      >
      </el-table-column>
      <el-table-column
        label="操作"
        width="350"
      >
        <template slot-scope="scope">
          <el-button
            type="danger"
            size="small"
            @click="resetPassword(scope.row)"
          >
            初始化密码
          </el-button>
          <el-button
            type="primary"
            size="small"
            @click="changeUnit(scope.row)"
          >
            编辑
          </el-button>
          <el-button
            type="primary"
            size="small"
            @click="deleteUnit(scope.row)"
          >
            删除
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-dialog
      :title="changetitle2"
      :visible.sync="showUint"
      width="40%"
    >
      <div class="f_title">基本信息</div>
      <el-form labelWidth="150px" :rules="rules" :model="form1" ref="form1">
        <el-form-item label="单位名称" prop="orgname">
          <el-input v-model="form1.orgname" clearable></el-input>
        </el-form-item>
        <el-form-item label="负责人" prop="manager">
          <el-input v-model="form1.manager" clearable></el-input>
        </el-form-item>
        <el-form-item label="负责人联系方式" prop="managertel">
          <el-input v-model.number="form1.managertel" clearable></el-input>
        </el-form-item>
        <el-form-item label="领导" prop="leader">
          <el-input v-model="form1.leader" clearable></el-input>
        </el-form-item>
        <el-form-item label="领导联系方式" prop="leadertel">
          <el-input v-model.number="form1.leadertel" clearable></el-input>
        </el-form-item>
        <el-form-item label="地址" prop="uaddress">
          <el-input v-model="form1.uaddress" clearable></el-input>
        </el-form-item>
        <el-form-item label="标签" v-if="this.$route.path == '/gldepartment/unit'">
          <el-radio-group v-model="form1.orgflag">
            <el-radio label="1">办事处</el-radio>
            <el-radio label="2">区镇</el-radio>
            <el-radio label="3">其他</el-radio>
          </el-radio-group>
        </el-form-item>
        <div class="f_title">账号信息</div>
        <el-form-item label="账号" prop="userid">
          <el-input v-model="form1.userid" @change="checkUserid" clearable></el-input>
        </el-form-item>
        <el-form-item label="密码" prop="passwords" class="is-required">
          <el-input v-model="form1.passwords" clearable type="password"></el-input>
        </el-form-item>
        <el-form-item label="确认密码" prop="passwords2" class="is-required">
          <el-input v-model="form1.passwords2" clearable type="password"></el-input>
        </el-form-item>

      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="showUint = false">取 消</el-button>
        <el-button type="primary" @click="newUnit(form1)">新 增</el-button>
      </span>
    </el-dialog>
    <el-dialog
      :title="changetitle"
      :visible.sync="showUint2"
      width="40%"
    >
      <div class="f_title">基本信息</div>
      <el-form labelWidth="150px">
        <el-form-item label="单位名称" class="is-required">
          <el-input v-model="unitData.orgname" v-validate="'required'" name="单位名称"></el-input>
          <div class="el-form-item__error">{{ errors.first('单位名称') }}</div>
        </el-form-item>
        <el-form-item label="负责人" class="is-required">
          <el-input v-model="unitData.manager" v-validate="'required'" name="负责人"></el-input>
          <div class="el-form-item__error">{{ errors.first('负责人') }}</div>
        </el-form-item>
        <el-form-item label="负责人联系方式" class="is-required">
          <el-input v-model="unitData.managertel" v-validate="'required'" name="负责人联系方式"></el-input>
          <div class="el-form-item__error">{{ errors.first('负责人联系方式') }}</div>
        </el-form-item>
        <el-form-item label="领导" class="is-required">
          <el-input v-model="unitData.leader" v-validate="'required'" name="领导"></el-input>
          <div class="el-form-item__error">{{ errors.first('领导') }}</div>
        </el-form-item>
        <el-form-item label="领导联系方式" class="is-required">
          <el-input v-model="unitData.leadertel" v-validate="'required'" name="领导联系方式"></el-input>
          <div class="el-form-item__error">{{ errors.first('领导联系方式') }}</div>
        </el-form-item>
        <el-form-item label="地址" class="is-required">
          <el-input v-model="unitData.uaddress" v-validate="'required'" name="地址"></el-input>
          <div class="el-form-item__error">{{ errors.first('地址') }}</div>
        </el-form-item>
        <el-form-item label="标签" v-if="this.$route.path == '/gldepartment/unit'" class="is-required">
          <el-radio-group v-model="unitData.orgflag">
            <el-radio label="1">办事处</el-radio>
            <el-radio label="2">区镇</el-radio>
            <el-radio label="3">其他</el-radio>
          </el-radio-group>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="showUint2 = false">取 消</el-button>
        <el-button type="primary" @click="saveChangeUnit">修 改</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
export default {
  data() {
    const validatePass = (rule, value, callback) => {
      if (value === '') {
        callback(new Error('请输入密码'));
      } else {
        if (this.form1.passwords2 !== '') {
          this.$refs.form1.validateField('passwords2');
        }
        callback();
      }
    };
    const validatePass2 = (rule, value, callback) => {
      if (value === '') {
        callback(new Error('请再次输入密码'));
      } else if (value !== this.form1.passwords) {
        callback(new Error('两次输入密码不一致!'));
      } else {
        callback();
      }
    };
    return {
      form1: {
        changetitle: '',
        changetitle2: '',
        orgname: '',
        uaddress: '',
        manager: '',
        managertel: '',
        leader: '',
        leadertel: '',
        userid: '',
        passwords: '',
        passwords2: '',
        orgflag: '',
      },
      ts: this.newStore(),
      showCheck: false,
      showUint: false,
      showUint2: false,
      loadingunit: true,
      quaryParam: '',
      sortNum: '',
      suporgid: '',
      unitList: [],
      unitData: {},
      isOk: false,

      rules: {
        orgname: [
          {
            required: true, // 是否必填
            message: '单位不能为空', // 规则
            trigger: 'blur', // 何事件触发
          },
        ],
        uaddress: [
          {
            required: true, // 是否必填
            message: '地址不能为空', // 规则
            trigger: 'blur', // 何事件触发
          },
        ],
        manager: [
          {
            required: true, // 是否必填
            message: '负责人不能为空', // 规则
            trigger: 'blur', // 何事件触发
          },
        ],
        managertel: [
          {
            required: true, // 是否必填
            message: '负责人联系方式不能为空', // 规则
            trigger: 'blur', // 何事件触发
          },
        ],
        leader: [
          {
            required: true, // 是否必填
            message: '领导不能为空', // 规则
            trigger: 'blur', // 何事件触发
          },
        ],
        leadertel: [
          {
            required: true, // 是否必填
            message: '领导联系方式不能为空', // 规则
            trigger: 'blur', // 何事件触发
          },
        ],
        userid: [
          {
            required: true, // 是否必填
            message: '单位不能为空', // 规则
            trigger: 'blur', // 何事件触发
          },
        ],
        orgflag: [
          {
            required: true, // 是否必填
            message: '标签不能为空', // 规则
            trigger: 'blur', // 何事件触发
          },
        ],
        passwords: [
          { validator: validatePass, trigger: 'blur' },
        ],
        passwords2: [
          { validator: validatePass2, trigger: 'blur' },
        ],
      },
    };
  },
  created() {
    if (this.$route.path == '/gldepartment/section') {
      this.changetitle = '修改牵头单位';
      this.changetitle2 = '新增牵头单位';
    } else if (this.$route.path == '/gldepartment/unit') {
      this.changetitle = '修改责任单位';
      this.changetitle2 = '新增责任单位';
    } else {
      this.changetitle = '修改协同部门';
      this.changetitle2 = '新增协同部门';
    }
    this.getUnitList();
  },
  methods: {
    resetPassword(item) {
      const req = {
        handle: '04A3682CDCA57EBA0DA6C15FB2ECC84B4240F18B8FB643536A677D1C1AAE06F9',
        userid: item.hash.userid,
        passwords: '123456',
      };
      this.$confirm('确定重置?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(() => {
        this.spost(this.ts, '/mainservlet', req).then((ts) => {
          this.$alert('重置成功,初始密码：123456', '提示', {
            confirmButtonText: '确定',
          });
          this.getUnitList();
        });
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消',
        });
      });
    },
    // Submit() {
    //   this.$validator.validateAll().then((result) => {
    //     if (result) {
    //       // 这里写具体的接口请求
    //       alert('推荐成功！');
    //       return;
    //     }
    //     alert('请输入完整推荐信息！');
    //   });
    // },
    deleteUnit(item) {
      const req = {
        handle: '67A5B6FEF17D97DEF1D0D23DA4270B6399C94A60607326CA',
        orgid: item.hash.orgid,
      };
      this.$confirm('确定删除?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(() => {
        this.spost(this.ts, '/mainservlet', req).then((ts) => {
          if (ts.d.data.operation1[0].hash.msg == 'success') {
            this.$message({
              type: 'success',
              message: '删除成功!',
            });
            this.getUnitList();
          } else {
            this.$message({
              type: 'error',
              message: ts.d.data.operation1[0].hash.msg,
            });
          }
        });
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除',
        });
      });
    },
    saveChangeUnit() {
      this.$validator.validateAll().then((result) => {
        if (result) {
          const req = {
            handle: '67A5B6FEF17D97DE0AB0D17168BEEBCD04453EE0A5CF10A0',
            orgname: this.unitData.orgname,
            uaddress: this.unitData.uaddress,
            manager: this.unitData.manager,
            managertel: this.unitData.managertel,
            leader: this.unitData.leader,
            leadertel: this.unitData.leadertel,
            orgid: this.unitData.orgid,
            orgflag: this.unitData.orgflag,
          };
          this.$confirm('确定修改?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning',
          }).then(() => {
            this.spost(this.ts, '/mainservlet', req).then(() => {
              this.$message({
                type: 'success',
                message: '修改成功!',
              });
              this.showUint2 = false;
              this.getUnitList();
            });
          }).catch(() => {
            this.$message({
              type: 'info',
              message: '已取消',
            });
          });
        } else {
          this.$message.error('内容不能为空！');
          return false;
        }
      });
    },
    changeUnit(item) {
      this.showUint2 = true;
      const req = {
        handle: '67A5B6FEF17D97DE41472B87C055439393B923BD4A7449EE',
        orgid: item.hash.orgid,
      };
      this.spost(this.ts, '/mainservlet', req).then((ts) => {
        this.unitData = ts.d.data.operation1[0].hash;
      });
    },
    checkUserid(val) {
      const req = {
        handle: '04A3682CDCA57EBA0DA6C15FB2ECC84B5E8BDFF2EA6AEE2EB1D57B5DB6274A7E',
        userid: val,
      };
      this.spost(this.ts, '/mainservlet', req).then((ts) => {
        if (ts.d.data.operation1[0].hash.cou == '0') {
          this.isOk = true;
          this.$message({
            message: '用户名校验成功！',
            type: 'success',
          });
        } else {
          this.isOk = false;
          this.$message.error('用户名已存在，请重新填写！');
        }
      });
    },
    newUnit() {
      this.$refs.form1.validate((valid) => {
        if (valid) {
          const req = {
            handle: '67A5B6FEF17D97DE8AD68148755261CACC426B34C0BBA8ED',
            suporgid: this.suporgid,
            orgname: this.form1.orgname,
            uaddress: this.form1.uaddress,
            manager: this.form1.manager,
            managertel: this.form1.managertel,
            leader: this.form1.leader,
            leadertel: this.form1.leadertel,
            userid: this.form1.userid,
            passwords: this.form1.passwords,
            orgflag: this.form1.orgflag,
          };

          if (this.isOk) {
            this.$confirm('确定新增?', '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning',
            }).then(() => {
              this.spost(this.ts, '/mainservlet', req).then(() => {
                this.$message({
                  type: 'success',
                  message: '新增成功!',
                });
                this.showUint = false;
                this.getUnitList();
                this.form1 = {};
              });
            }).catch(() => {
              this.$message({
                type: 'info',
                message: '已取消',
              });
            });
          } else {
            this.$message.error('用户名已存在，请重新填写！');
          }
        } else {
          this.$message.error('内容不能为空！');
          return false;
        }
      });
    },
    getUnitList() {
      const req = {
        handle: '67A5B6FEF17D97DECF116BDF95B95C0BC327730680009A98',
        suporgid: '1',
        orgname: this.quaryParam,
        start: '0',
        limit: '10',
      };
      const req2 = {
        handle: '67A5B6FEF17D97DECF116BDF95B95C0BC327730680009A98',
        suporgid: '2',
        orgname: this.quaryParam,
        start: '0',
        limit: '10',
      };
      const req3 = {
        handle: '67A5B6FEF17D97DECF116BDF95B95C0BC327730680009A98',
        suporgid: '4',
        orgname: this.quaryParam,
        start: '0',
        limit: '10',
      };
      if (this.$route.path == '/gldepartment/unit') {
        this.spost(this.ts, '/mainservlet', req2).then((ts) => {
          this.unitList = ts.d.data.operation1;
          this.suporgid = '2';
          this.loadingunit = false;
        });
      } else if (this.$route.path == '/gldepartment/cop') {
        this.spost(this.ts, '/mainservlet', req3).then((ts) => {
          this.unitList = ts.d.data.operation1;
          this.suporgid = '4';
          this.loadingunit = false;
        });
      } else {
        this.spost(this.ts, '/mainservlet', req).then((ts) => {
          this.unitList = ts.d.data.operation1;
          this.suporgid = '1';
          this.loadingunit = false;
        });
      }
    },
  },
};
</script>

<style lang="stylus">
.el-form-item.is-required .el-form-item__label:before
  content: '*'
  color: #f56c6c
  margin-right: 4px
.f_title
  margin-bottom: 20px;
  height: 20px
  line-height: 20px
  font-size: 16px;
  border-bottom: 1px solid #f1f1f1;
.el-input--suffix .el-input__inner
  font-size 13px
.el-button
  font-size 13px
.el-table th>.cell
  text-align center
.el-table .cell
  text-align center
.el-select
  width 14%
  margin-right 1%
.select_top
  width 92%
  margin 20px auto
.el-col
  padding: 20px 10px;
</style>
